<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>出差申请单</title>
    <link rel="stylesheet" href="../../../css/aui.css" />
    <link rel="stylesheet" href="../../../css/my/apply.css" />
    <script src="../../../script/widget/include.js"></script>
    <link rel="stylesheet" href="../../../css/trip/apply/date.css">
    <link rel="stylesheet" href="../../../css/wangImgEnlarge.css" />
    <style>
        .apply {
            padding: 8px 20px 5px 20px;
        }

        .apply p {
            margin: 0.3rem 0;
            font-size: 0.6rem;
        }

        .apply .content {
            float: right;
        }

        body .sign-class .layui-layer-content {
            height: 208px!important;
        }

        body .sign-class .layui-layer-btn {
            padding-top: 0;
            padding-bottom: 0;
        }

        body .sign-class .layui-layer-btn .layui-layer-btn0 {
            border: 1px solid #808080!important;
            background-color: white!important;
            color: #333;
        }

        body .sign-class .layui-layer-btn .layui-layer-btn1 {
            background-color: #1E9FFF;
            color: white;
        }
    </style>
</head>

<body style="cursor: pointer">

    <div class="aui-content main_content" style="margin-top: 0.3rem;top: 0;">
        <!--step1:审批轨迹-->
        <div class="apply_style apply">
            <h3>（一）审批轨迹</h3>
            <div  id="approve_info"></div>
        </div>

        <!--step2:订单信息-->
        <div class="apply_style apply" style="margin-top: 10px;">
            <h3>（二）订单信息</h3>
            <p>预订人<span class="content" id="book_user_name">--</span></p>
            <p>申请单号<span class="content" id="travel_application_number">--</span></p>
            <p>出差始发地<span class="content" id="travel_site">--</span></p>
            <p>出差目的地<span class="content" id="travel_destination">--</span></p>
            <p>出差开始时间<span class="content" id="travel_time">--</span></p>
            <p>出差结束时间<span class="content" id="travel_end_time">--</span></p>
            <p>出行人<span class="content" id="business_name">--</span></p>
            <p>审批人<span class="content" id="approve_name">--</span></p>
            <p>出差原因<span class="content" id="travel_cause">--</span></p>
            <li class="aui-list-item">
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title">图片</div>
                    <!--图片列表-->
                    <div class="aui-row aui-row-padded" id="imageList">
                    </div>
                </div>
            </li>
        </div>


        <!-- step3:审核签名模板 -->
        <div class="apply_style apply" style="margin-top: 10px;">
            <h3>（三）审批签名</h3>
            <div id="sign_info"></div>
        </div>

        <!--step4:审核操作模板-->
        <div class="aui-content-padded" style="text-align: center;">
            <div id="approve_option"></div>
        </div>
    </div>

    <!--拒绝原因-->
    <div style="padding:8%;display:none;" id="rejectCause">
        <div class="aui-list-item-inner">
            <div class="aui-list-item-input" style="">
                <label class="aui-show aui-margin-t-10"><input class="aui-radio" type="radio" name="demo1" checked value="价格太高"> 价格太高</label>
                <label class="aui-show aui-margin-t-10"><input class="aui-radio" type="radio" name="demo1" value="出差任务取消"> 出差任务取消</label>
                <label class="aui-show aui-margin-t-10"><input class="aui-radio" type="radio" name="demo1" value="出差计划可能变动"> 出差计划可能变动</label>
                <label class="aui-show aui-margin-t-10"><input class="aui-radio" type="radio" name="demo1" value="超出可审批权限范围"> 超出可审批权限范围</label>
            </div>
        </div>
    </div>

    <!--签名-->
    <div class="htmleaf-container" id="signPass" style="display:none;">
        <div class="container">
            <div class="col-xs-12">
                <!--<h4>签名板</h4>-->
                <div class="js-signature" style="width:100% !important;" data-height="200" data-border="1px solid #e0e0e0" data-line-color="black" data-background="white" data-auto-fit="false"></div>
                <div id="signature" style="display: none">
                    <p><em>保存后，签名结果将显示在下面</em></p>
                </div>
            </div>
        </div>
    </div>
</body>

</html>
<script type="text/javascript" src="../../../script/aui/api.js"></script>
<script type="text/javascript" src="../../../script/extend/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../../../script/extend/doT.min.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/config.js"></script>
<script type="text/javascript" src="../../../script/layer/layer.js"></script>
<script type="text/javascript" src="../../../script/extend/jq-signature.js"></script>
<script type="text/javascript" src="../../../script/extend/wangImgEnlarge.js"></script>
<script type="text/javascript" src="../../../service/index/apply/applyInfo.js"></script>
<!--图片列表-->
<script id="imageListTpl" type="text/x-dot-template">
    {{ for(var prop=0, leng=it.length; prop<leng; prop++) { }}
    <div class="aui-col-xs-4">
        <img src="{{=it[prop]['src']}}" width="100%">
    </div>
    {{ } }}
</script>
<script id="apply_tpl" type="text/x-dot-template">
	<p><label>{{= it.book_user_name }}<span>&emsp;发起审批</span></label><label class="content">{{= it.create_time }}</label></p>
	{{ if(it.approved_user != ''){ }}
		{{ for(var prop=0, leng=it.approved_user.length; prop<leng; prop++) { }}
			{{ if(it.approved_user[prop]['approved_status'] == 0){ }}
			<p><label>[{{=prop+1}}级审批] {{= it.approved_user[prop]['user_name'] }}<span style="color: green;">&emsp;审批通过</span></label><label class="content">{{= it.approved_user[prop]['approved_time'] }}</label></p>
			{{ } else { }}
			<p><label>[{{=prop+1}}级审批] {{= it.approved_user[prop]['user_name'] }}<span style="color: red;">&emsp;审批驳回</span></label><label class="content">{{= it.approved_user[prop]['approved_time'] }}</label></p>
			<p><label>驳回原因：{{= it.approved_user[prop]['dismissal_cause'] }}</label></p>
			{{ } }}
		{{ } }}
	{{ } }}
</script>
<!-- 审核签名模板 -->
<script id="approve_sign" type="text/x-dot-template">
	{{ if(it.approved_user != ''){ }}
		{{ for(var prop=0, leng=it.approved_user.length; prop<leng; prop++) { }}
			{{ if(it.approved_user[prop]['approved_status'] == 0){ }}
          {{ if(it.approved_user[prop]['sign_url'] != '' && it.approved_user[prop]['sign_url'] != null){ }}
    			<p><label>[{{=prop+1}}级审批] {{= it.approved_user[prop]['user_name'] }}</label></p>
    			<div style="height: 3rem;width: 3rem;">
    				<img src="{{= it.approved_user[prop]['sign_url'] }}" style="max-width: 100%;max-height:100%;">
    			</div>
          {{ } }}
			{{ }else{ }}
			<p><label>已驳回</label></p>
			{{ } }}
		{{ } }}
	{{ }else{ }}
	<p><label>暂无</label></p>
	{{ } }}
</script>
<!-- 审核操作模板 -->
<script id="approve_option_tpl" type="text/x-dot-template">
    {{ if(it['is_turn'] == 0 && it['status'] != '已通过' && it['status'] != '已驳回' && it['status'] != '已取消'){ }}
    <div class="aui-btn aui-btn-inline aui-btn-info changeStatus" style="margin: 0 1rem;">
        <input type="hidden" value="0">
        通过申请
    </div>
    <div class="aui-btn aui-btn-info aui-btn-inline changeStatus">
        <input type="hidden" value="1">
        驳回申请
    </div>
    {{ } }}
</script>

<script type="text/javascript">
    apiready = function() {
        api.parseTapmode();
        new applyInfo();
    };
</script>
